HTML Help
HTML in posts (either on a blog or in forum) lets you liven things up by allowing you to add images, change the font size, colour and face etc. easily. ''Note: This is for use on StumbleUpon.com, if you want HTML help for full websites'' there are many tutorials on the web = Fonts = Size To change the size of the font just insert: Hi. This example would produce: Hi The values range from 1-7, default being 2. Colour To change the colour of the font just insert: Hi. This example would produce: Hi You can either use hexadecimal values (e.g. #FF0000 = red) or colour names, a list can be found here: http://stumbleupon.group.stumbleupon.com/forum/5833/10/ Face To change the face of the font just insert: Hi. This example would produce: Hi ''Note: If you've downloaded a font that you'd like to use; other people won't be able '' to see it unless they have also have it, otherwise they will see the default font. Common fonts: *Arial *Arial Black *Arial Narrow *Comic Sans MS *Courier *Courier New *Georgia *Impact *Times New Roman *Verdana Combining Properties You can easily combine the above tags so that you can have a size 5, colour red font. You do this in one font tag: Hi Hi = Formatting = Bold Bold Bold Italic Italic Italic Underline Underline Underline Strikethrough Strikethrough Strikethrough Center Center Center = Images = Adding an Image The simplest method of adding an image to your blog is Photoblogging, however this method is severly limited (e.g. can only blog one image at a time). Instead one can use the HTML tag img to add and manipulate images. For example: ' will produce: Resizing To resize an image just specify the height and width. For example: ' will produce: ''Note: If you only include either the height or the width, the image will be'' automatically scaled. For example, if you change the width of an 100px * 200px image to 50px, the height will be automatically changed to 100px. Borders To add a border to an image, simply add border=x (where x is the width) like this: ' ''Note:' To specify the style and colour of borders, use css. A tutorial can be found '' ''on this Wiki here: CSS Guide Text Alignment Relative to Image To align the picture to the left or right allowing text to go next to it, add align=left/right. For example '' Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... '' will produce: Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... Some text goes here... . Center Image To center an image, simply inclose the image tag in center tags: will produce: = Links = Adding a Link To add a link simply use the a'' tag. Change the ''href to the page location to which you are linking to, and wrap it around a piece of text/image: Stumbleupon will produce: Stumbleupon Adding a Link to an Image To link an image, simply enclose the img tag within the a'' tag. This example would produce an image which would link to stumbleupon.com: '' ''Note: The reason why I added border=0, is simply to stop some browser from'' automatically adding a border. Such borders are in the colour of the link. What is rel="nofollow"? rel="nofollow" is often added to links automatically by StumbleUpon. It is nothing dangerous, and doesn't change anything. It is simply there to communicate with search engine bots. = Miscellaneous = Lists Bullet Points This type of list is the most common. Start of with a ul tag, and add li tags within. You can have an unlimited amount of bullets, just add and delete li tags: '' A list item... A list item... A list item... '' *A list item... *A list item... *A list item... Numbered The numbered list is exactly the same except it uses ol tags instead of ul tags. '' A list item... A list item... A list item... '' #A list item... #A list item... #A list item... Multiple Spaces A very intresting thing about HTML is that it ignores multiple spaces one after each other. This is hardly ever a problem, but if it does bother you there is a simple way of adding spaces; use the following character code instead of one space: To use it, just type it in and it will automatically be converted to a space. ''Tip: Finding it difficult to remember? NBSP simply stands for 'N'on 'B'reaking 'Sp'ace!'' category:Help